<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<title></title>
	</head>
	<body>
		
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">拍照 </h1>
			<a class="mui-icon-right-nav mui-pull-right">
				<span id="headImage" class="mui-icon mui-icon-camera"></span>
			</a>
			<a class="mui-icon-right-nav mui-pull-right">
				<span id="uploadImage" class="mui-icon mui-icon-upload"></span>
			</a>
		</header>
		<div class="mui-content" style="background-color:#fff">
			<ul id="imgs" class="mui-table-view mui-grid-view">
				<!--<li class="mui-table-view-cell mui-media mui-col-xs-6">
					<a href="#">
						<img class="mui-media-object" src="images/shuijiao.jpg">
						<span class="mui-icon mui-icon-trash deleteBtn"></span>
						<div class="mui-media-body">
							<input type="text" class="remark" placeholder="备注">
						</div>
					</a>
				</li>-->
			</ul>
		</div>
		
		 <script src="../js/mui.min.js"></script>  
        
        <script src="../js/jquery.min.js"></script>  
        <script src="../js/muishow.js" type="text/javascript" charset="utf-8"></script>
        <script src="../js/req.js" type="text/javascript" charset="utf-8"></script>
        
        
        <script type="text/javascript">
        	
        	var fileArr = [];
		mui.init({
			swipeBack: true //启用右滑关闭功能
		});
		document.getElementById('headImage').addEventListener('tap', function() {
			if(mui.os.plus) {
				var buttonTit = [{
					title: "拍照"
				}, {
					title: "从手机相册选择"
				}];


				plus.nativeUI.actionSheet({
					title: "上传图片",
					cancel: "取消",
					buttons: buttonTit
				}, function(b) { /*actionSheet 按钮点击事件*/
					switch(b.index) {
						case 0:
							break;
						case 1:
							getImage(); /*拍照*/
							break;
						case 2:
							galleryImg(); /*打开相册*/
							break;
						default:
							break;
					}
				})
			}
		}, false);


		// 拍照获取图片  
		function getImage() {
			var c = plus.camera.getCamera();
			c.captureImage(function(e) {
				plus.io.resolveLocalFileSystemURL(e, function(entry) {
					var imgSrc = entry.toLocalURL() + "?version=" + new Date().getTime(); //拿到图片路径  
					setFile(imgSrc);
					setHtml(imgSrc);
				}, function(e) {
					console.log("读取拍照文件错误：" + e.message);
				});
			}, function(s) {
				console.log("error" + s.message);
			}, {
				filename: "_doc/camera/"
			})
		}
		// 从相册中选择图片   
		function galleryImg() {
			// 从相册中选择图片  
			plus.gallery.pick(function(e) {
				for(var i in e.files) {
					var fileSrc = e.files[i];
					setFile(fileSrc);
					setHtml(fileSrc);
				}
			}, function(e) {
				console.log("取消选择图片");
			}, {
				filter: "image",
				multiple: true,
				//maximum: 5,
				system: false,
				onmaxed: function() {
					plus.nativeUI.alert('最多只能选择5张图片');
				}
			});
		}


		function setHtml(path) {
			var str = '';
			str = '<li class="mui-table-view-cell mui-media mui-col-xs-6">'+
					'<img class="mui-media-object" src="'+path+'">'+
					'<span class="mui-icon mui-icon-trash deleteBtn"></span>'+
//					'<div class="mui-media-body">'+
//						'<input type="text" class="remark" placeholder="备注">'+
//					'</div>'+
				'</li>';
			jQuery("#imgs").append(str);
		}
		
		function setFile(fileSrc){
			var image = new Image();  
			image.src = fileSrc;
			fileArr.push(image);
		}
		
		
		document.getElementById('uploadImage').addEventListener('tap',function(){
			var files = fileArr;
			console.log(files);
		 	var wt=plus.nativeUI.showWaiting();
		 	var server = hurl + '/api/Image/upload';
            var task=plus.uploader.createUpload(server,
                {method:"POST"},
                function(t,status){ //上传完成
                    if(status==200){
                        alert("上传成功："+t.responseText);
                        wt.close(); //关闭等待提示按钮
                    }else{
                        alert("上传失败："+status);
                        wt.close();//关闭等待提示按钮
                    }
                }
            );  
             //将文件集合添加到上传队列中
		    for(var i=0;i<files.length;i++){
		        var f=files[i];
		 		task.addData("access_token",acctoken());
		        task.addFile(f.src,{key:i});
		    }
		    //传其他的参数 如备注
		    //添加其他参数
		    //遍历5个input框
		    
           
            task.start();
		});	
        </script>
	</body>
</html>
